<template>
  <div>
    <nav-bar title="个人信息"
             left-arrow
             :onClickLeft="onClickLeft"
    />
    <div class="content-body">
      <page-skeleton title avatar :loading="false" :row="1" :count="10" style="width: 100%">
        <van-cell-group>
          <van-cell is-link>
            <template #title>
              <div class="head-title">
                <div class="head-label">头像</div>
                <van-image
                  class="head-img"
                  lazy-load
                  radius="4"
                  src="https://img01.yzcdn.cn/vant/cat.jpeg"
                />
              </div>
            </template>
            <template #right-icon>
              <van-icon name="arrow" color="#969799" class="head-right"/>
            </template>
          </van-cell>

          <van-cell title="昵称" value="自古一楼不简单" is-link/>
          <van-cell title="账号" value="uuid88888888" is-link/>

        </van-cell-group>

        <empty-line height="6px"/>

        <van-cell-group>
          <van-cell title="性别" value="男" is-link/>
          <van-cell title="地区" value="辽宁 大连" is-link/>
          <van-cell title="个性签名" value="FROM ZERO TO HERO" is-link/>
        </van-cell-group>

        <empty-line height="6px"/>

        <van-cell-group>
        <van-cell-group>
          <van-cell title="二维码名片" is-link/>
        </van-cell-group>

      </page-skeleton>
    </div>

  </div>
</template>

<script>
  import EmptyLine from "@/components/EmptyLine"
  import NavBar from "@/components/NavBar"
  export default {
    name: "SelfInfo",
    components: {EmptyLine, NavBar},
    data() {
      return {

      }
    },
    methods: {
      onClickLeft() {
        this.$router.go(-1);
      }
    }
  }
</script>

<style scoped>
  .content-body {
    width: 100%;
    display: inline-flex;
    margin-top: 1.22667rem;
  }
  .head-title {
    display: inline-flex;
    width: 100%;
  }
  .head-label {
    text-align: left;
    width: 82%;
    line-height: 60px
  }
  .head-img {
    width: 60px;
    height: 60px;
  }
  .head-right {
    font-size: .42667rem;
    line-height: 60px
  }
</style>